<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Spring Security Login</title>
</head>
<body>
<div th:if="${param.error}">
    用户名密码错误，要不去<a th:href="@{/}">首页</a>看看？
</div>
<div th:if="${param.logout}">
    您已经登出
</div>
<form th:action="@{/doLogin}" method="post">
    <div><label> 用户名 : <input type="text" name="username"/> </label></div>
    <div><label> 密码: <input type="password" name="password"/> </label></div>
    <div><label> 验证码: <input type="text" name="kapchaCode" id="kapchaCode"/> </label><img id="codeImg" src="/code" onclick="changeVerifyCode()" style="cursor: pointer;"></div>
    <div><input type="submit" value="登录"/></div>
</form>
</body>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>
<script type="text/javascript">
    function changeVerifyCode() {
        console.log("click code");
         $("#codeImg").attr("src","/code?r="+Math.random());
    }
</script>
</html>